<template>
  <div class="admin-header-class">
    <div class="admin-title">管理系统</div>
    <div class="admin-function-class">
  <el-menu :default-active="activeIndex" class="el-menu-demo" style="display: inline-block" mode="horizontal" @select="handleSelect">
    <el-menu-item index="/admin/movieManager">电影管理</el-menu-item>
    <el-menu-item index="/admin/userManager">
      人员管理
    </el-menu-item>
  </el-menu>
    <div style="padding-right: 20px;float: right;padding-top: 20px">
      <el-button type="success" @click="loginOut" round>退出登录</el-button>
    </div>
  </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      activeIndex: '1',
      name: this.$cookies.get('username')
    }
  },
  methods: {
    handleSelect (key, keyPath) {
      this.$router.push(key)
    },
    loginOut () {
      this.$cookies.remove('username')
      this.$cookies.set('token', '0')
      this.$router.push('/login')
    }
  }
}
</script>
<style>
.admin-header-class{
  background-color: #f2f6f6;
  width: 100%;
}
.admin-title{
  width: 100px;
  text-align: center;
  margin: 0 auto;
  font-size:20px;
  color: #b82949
}
.admin-function-class{
  background-color: #f2f6f6;
}
.el-menu{
  background-color: #f2f6f6;
}
</style>
